import React, { Component } from 'react';
import axios from 'axios';
import store from '@/store';
class App extends Component {
	constructor (props) {
		super(props);
		this.state = {
			count: 0
		}
	}
	componentDidMount () {
		axios.get('/users/goodswoman')
			.then((data) => {
				console.log(data.data)
				store.dispatch({
					type: 'CHANGE_WOMEN_LIST',
					data: data.data
				})
			})
	}
	sendIdFn (id) {
		this.props.history.push('/detail/'+id);
	}
	buyzh () {
		axios.get('/users/goodswoman')
			.then((data) => {
				store.dispatch({
					type: 'CHANGE_WOMEN_LIST',
					data: data.data
				})
			})
	}
	buys () {
		axios.get('/users/goodswoman')
			.then((data) => {
				var arr = data.data;
				function compare(propertyName) {
			    return function(object1, object2) {
			      var value1 = object1[propertyName];
			      var value2 = object2[propertyName];
			  		return value1 - value2
			    }
			  }
				arr.sort(compare("goods_sales"));
				console.log(arr)
				store.dispatch({
					type: 'CHANGE_WOMEN_LIST',
					data: arr
				})
			})
	}
	buyprice () {
		this.state.count ++;
		if(this.state.count%2 === 1){
			axios.get('/users/goodswoman')
				.then((data) => {
					var arr = data.data;
					function compare(propertyName) {
				    return function(object1, object2) {
				      var value1 = object1[propertyName];
				      var value2 = object2[propertyName];
				  		return value1 - value2
				    }
				  }
					arr.sort(compare("goods_newprice"));
					console.log(arr)
					store.dispatch({
						type: 'CHANGE_WOMEN_LIST',
						data: arr
					})
				})
		}else {
			axios.get('/users/goodswoman')
				.then((data) => {
					var arr = data.data;
					function compare(propertyName) {
				    return function(object1, object2) {
				      var value1 = object1[propertyName];
				      var value2 = object2[propertyName];
				  		return value2 - value1
				    }
				  }
					arr.sort(compare("goods_newprice"));
					console.log(arr)
					store.dispatch({
						type: 'CHANGE_WOMEN_LIST',
						data: arr
					})
				})
		}
	}
	gossPage () {
		this.props.history.push('/search')
	}
	golastPage () {
		this.props.history.go(-1)
	}
  render() {
    return (
			<div className="container">
      	<div className="box">
      		<header className="header list-header">
						<i className="iconfont icon-left-copy" id="backbtn" onClick={ this.golastPage.bind(this) }></i>
						<div className="ssk2">
							<i className="iconfont icon-icon-search"></i>
							<input type="text" className="ss" placeholder="冬款" onClick={this.gossPage.bind(this)}/>
						</div>
					</header>
					<div className="content">
						<div className="list-top">
								<ul>
									<li onClick={ this.buyzh.bind(this) }>综合</li>
									<li onClick={ this.buys.bind(this) }>销量</li>
									<li onClick={ this.buyprice.bind(this) }>
										价格
										<span className="price">
											<i className="iconfont icon-paixuxia"></i>
										</span>
									</li>
									<li>筛选</li>
								</ul>
						</div>
						<ul className="man-list">
							{
								store.getState().man.womenlist.map((item,index) => {
									return (
									  <li key={ index } onClick={ this.sendIdFn.bind(this, item._id) }>
									  	<img alt="www.baidu.com" src={ item.goods_img }/>
									  	<i>{ item.goods_brand }</i>
									  	<p>{ item.goods_name }</p>
									  	<div className="libottom">
									  		<em>￥{ item.goods_newprice }</em>
									  		<strong>{ item.goods_zhekou }</strong>
									  	</div>
									  </li>
									)
								})
							}
						</ul>
					</div>
      	</div>
			</div>
    );
  }
}

export default App;
